Ext.define('navigationField', {
    extend: 'Ext.form.field.Display',
    width: '7%',
    fieldCls: 'nav',
    margin: '50 0 0 10',
    // listeners: [{
    //     render: function (p) {
    //         p.getEl().on('click', function () {
    //             alert('hhh');
    //         });
    //     }
    // }]
});
Ext.onReady(function () {
    Ext.create('Ext.Viewport', {
        title: 'Border Layout',
        layout: 'border',
        items: [{
            region: 'north',
            height: '10%',
            border: false,
            margin: '0,0,0,0',
            bodyStyle: 'background: #4481CE',
            layout: 'hbox', //横向格子布局
            items: [{
                xtype: 'panel',
                width: '70%',
                height: '100%',
                border: false,
                bodyStyle: 'background: #4481CE',
                items: [{
                    xtype: 'panel',
                    layout: 'hbox', //横向格子布局
                    border: false,
                    bodyStyle: 'background: #4481CE',
                    items: [
                        Ext.create('navigationField', {
                            value: '个人空间',
                            listeners: [{
                                render: function (p) {
                                    p.getEl().on('click', function () {
                                        Ext.getCmp('centerRegion').removeAll(false);
                                        Ext.getCmp('westRegion').removeAll(false);
                                        Ext.getCmp('westRegion').setHidden(true);
                                        Ext.getCmp('centerRegion').add(personSpaceTabPanel);
                                        personSpaceTabPanel.tabBar.items.items[2].hide();//将第三个tab隐藏
                                        personSpaceTabClick(0);
                                        personSpaceTabPanel.setActiveTab(0);
                                    });
                                }
                            }]
                        }),
                        Ext.create('navigationField', {
                            value: '班级管理',
                            listeners: [{
                                render: function (p) {
                                    p.getEl().on('click', function () {
                                        Ext.getCmp('centerRegion').removeAll(false);
                                        Ext.getCmp('westRegion').setHidden(true);
                                        classesListStore.reload();
                                        Ext.getCmp('centerRegion').add(classesGrid);
                                    });
                                }
                            }]
                        })
                        // Ext.create('navigationField', {
                        //     value: '问题反馈'
                        // }),
                        // Ext.create('navigationField', {
                        //     value: '教学白板'
                        // }),
                        // Ext.create('navigationField', {
                        //     value: '视频会议'
                        // })
                    ]
                }]
            }, {
                xtype: 'panel',
                width: '30%',
                height: '100%',
                border: false,
                bodyStyle: 'background: #4481CE',
                items: [{
                    xtype: 'toolbar',
                    style: 'background: #4481CE',
                    border: false,
                    items: ['->', {
                        xtype: 'splitbutton',
                        text: 'hi ~ ' + currentUser,
                        tooltip: '当前用户:' + currentUser,
                        icon: 'static/images/icons/fam/user.gif',
                        menu: new Ext.menu.Menu({
                            items: [{
                                text: '注销',
                                icon: 'static/images/icons/fam/delete.gif',
                                handler: function () {
                                    userLogout();
                                }
                            }]
                        })
                    }]
                }]
            }]
        }, taskTabPanel, {
            region: 'west',
            id: 'westRegion',
            margin: '5 5 5 5',
            title: '菜单栏',
            width: '20%',
            layout: 'fit',
            split: true,//设置能不能鼠标拖动改变宽度
            collapsible: true,    // 有没有按钮向内缩进
            //items: testRequirementLeftTree,//将你上面定义的树形组件放进去
            frame: true//边框圆润一点
        }, {
            region: 'center',
            id: 'centerRegion',
            margin: '5 5 0 0',
            border: false,
            layout: 'fit',
            header: false,
//            overflowX: 'hidden', //设置横向滚动条不显示
//            overflowY: 'auto', //设置纵向滚动条超出高度显示
            autoScroll: true, //大小溢出时自动出现滚动条
        }]
    });
    chatOnlineKey = getUuid();//生成Key
    webSocket = createWebSocket('ws://' + gateWayUrl + '/websocket/chat/' + currentUserId + '/' + chatOnlineKey);//进行webSocket连接
});